<template>
	<div class="hello">

	</div>
</template>

<script>
	/* eslint-disable no-unused-vars */
	import * as THREE from 'three';
	import * as DxfParser from 'dxf-parser';
	import {
		DXFLoader
	} from 'three-dxf-loader';
	import {
		Viewer
	} from 'three-dxf'


	export default {
		name: 'HelloWorld',
		props: {
			msg: String
		},
		data() {
			return {
				// 场景、摄像机、渲染器等
				scene: null,
				camera: null,
				renderer: null,
				mesh: null
			}
		},
		mounted() {
			this.init();
			// this.animate();
		},
		methods: {
			init() {

				// 初始化场景
				this.scene = new THREE.Scene();

				// 初始化摄像机
				this.camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
				this.camera.position.z = 5;

				// 初始化渲染器
				this.renderer = new THREE.WebGLRenderer();
				this.renderer.setSize(window.innerWidth, window.innerHeight);
				document.body.appendChild(this.renderer.domElement);


				const loader = new DXFLoader();
				let that = this;
				loader.load('E007.dxf', function(dxf) {
					let group = dxf.entity
					console.log(111111, dxf)
					that.scene.add(group);
					// 设置模型位置和比例
					group.scale.set(0.012, 0.012, 0.012);
					group.position.set(-1.2, 0, 0);

					// 如果模型有动画，获取混合器并播放
					const mixer = new THREE.AnimationMixer(group);
					console.log(222222222, mixer)
					// const clips = group.animations;
					// if (clips) {
					// 	const clip = clips[0];
					// 	const action = mixer.clipAction(clip);
					// 	action.play();
					// }

					// 渲染函数
					function animate() {
						requestAnimationFrame(animate);
						that.renderer.render(that.scene, that.camera);
						// if (clips) {
						// 	// mixer.update(clock.getDelta());
						// }
					}
					animate();
				});



				// // 创建酒瓶几何体
				// let geometry = new THREE.CylinderGeometry(0.5, 0.5, 2);

				// // 创建材质
				// let material = new THREE.MeshLambertMaterial({
				// 	color: 0xffffff
				// });

				// // 创建酒瓶物体
				// this.mesh = new THREE.Mesh(geometry, material);
				// this.scene.add(this.mesh);

				// // 添加灯光
				// let ambientLight = new THREE.AmbientLight(0xcccccc);
				// this.scene.add(ambientLight);

				// let pointLight = new THREE.PointLight(0xffffff);
				// pointLight.position.set(0, 1, -2);
				// this.scene.add(pointLight);
			},
			animate() {
				requestAnimationFrame(this.animate);
				// this.mesh.rotation.x += 0.01;
				// this.mesh.rotation.y += 0.02;
				this.renderer.render(this.scene, this.camera);
			}
		},
	}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
	h3 {
		margin: 40px 0 0;
	}

	ul {
		list-style-type: none;
		padding: 0;
	}

	li {
		display: inline-block;
		margin: 0 10px;
	}

	a {
		color: #42b983;
	}
</style>